<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv=X-UA-Compatible content="IE=edge,chrome=1">
    <meta content=always name=referrer>
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/style_user.css">
    <script src="__STATIC__/js/jquery-1.8.2.js"></script>
    <title>{if condition="input('uid')"}注册{else/}登录{/if}</title>
    <script>
        $(function(){
            $(".tablist li").click(
                function(){
                    var a=$(".tablist li").index(this);
                    $(this).addClass("cur");
                    $(this).siblings().removeClass("cur");
                    $(".tabcon>div").eq(a).css({display:"block"});
                    $(".tabcon>div").eq(a).siblings().css({display:"none"});
                    $('#login').find('input').not('.log').val('');
                    $('#registers').find('input').not('.reg').val('');
                }
            )
        })
    </script>
    <style>
        input:-webkit-autofill{
            -webkit-animation-name: autofill;
            -webkit-animation-fill-mode: both;
        }
        @-webkit-keyframes autofill {
            to{
                /*color: #fff;*/
                background: transparent;
            }

        }
        input::-webkit-inner-spin-button{
            -webkit-appearance: none;
            -moz-appearance: none;
        }
         
        input::-webkit-outer-spin-button{
            -webki-appearance: none;
            -moz-appearance: none;
        }
    </style>
</head>
<body>
<div class="wrap-login">
    <div class="header">

        <img src="__STATIC__/img-wap/bg-my.png" class="bg">
        <input type="hidden" id="uid" value="{:input('uid','')}" />


    </div>
    <div class="tabcon">
        <!--登录开始-->
        <div id="login" {if condition="!input('?uid')"} class="cur" {/if} >

    </div>
    <!--登陆结束-->
    <!--注册开始-->

    <div id='registers' class="cur" >

    <form onsubmit="return false" action="" method="post" id="form_2">
        <div class="text">
            <label>账号</label><input type="number" maxlength="11" min="1" placeholder="手机号码注册" nullmsg="账号不能为空" name="username" id="un2" datatype="*" errormsg="账号格式不对(应为手机号)">
        </div>
        <input type="hidden" name="invit_id"  value="{:input('uid')}" />
        <div class="text">
            <label>验证码</label><input type="number" placeholder="验证码" nullmsg="请输入6位验证码" name="yzm" datatype="n6" id="yzm2" errormsg="验证码格式不正确" value="">
            <span><a href="javascript:check_num();" id="yzm_2">获取验证码</a></span>
        </div>
        <div class="text">
            <label>密码</label><input type="password" placeholder="密码 (6到18位)" id="pwd2" datatype="s6-18" name="password" nullmsg="密码不能为空" errormsg="密码格式不正确" maxlength="18">
            <img src="__STATIC__/img_user/dl-mimab.png" id="p_2" onclick="toggle(2)">
        </div>
        <input type="submit" value="注册" class="submit reg" id="sub_2">
    </form>
</div>
<!--注册结束-->
</div>

</div>
{include file="public/src" /}
<script>
    //验证表单元素
    $(function () {
        $.Tipmsg.r = null;
        $.Tipmsg.p = null;
        $.Datatype.n6 = /^\d{6}$/;
        $.Datatype.s4_20 = /^[\u4E00-\u9FA5\uf900-\ufa2d\w\.\s]{2,20}$/;
        var demo1 = $("#form_1").Validform({
            btnSubmit:'#sub_1',
            tiptype: function (msg) {
                layer.open({content: msg, skin: 'msg', time:2});
            },
            tipSweep: true,
            ajaxPost:true,
            callback:function(t){
                if (t.code == 200){
                    layer.open({content:t.message,skin:'msg',time:3});
                    setTimeout(function () {
                        window.location.href = "{:url('index/member/choose_system')}";   //跳转到主页
                    },2000);
                }else if(t.code == 201){  //去绑定手机号
                    layer.open({content:t.message,skin:'msg',time:3});
                    window.location.href = "{:url('mobile/user_info/bind_small_phone')}";
                } else {
                    layer.open({content:t.message,skin:'msg',time:2});
                }
            }
        });
        demo1.config({
            ajaxpost:{
                error: function () {
                    layer.open({content:'网络繁忙,请重试',skin:'msg',time:2});
                }
            }
        });
        var demo2 = $("#form_2").Validform({

            tiptype: function (msg) {
                layer.open({content: msg, skin: 'msg', time:2});
            },
            btnSubmit:'#sub_2',
            tipSweep: true,
            ajaxPost:true,
            callback:function(t){
                layer.open({content:t.message,skin:'msg',time:3});
                if (t.code == 200){
                    //跳转到个人信息
                    window.location.href = "{:url('index/member/choose_system')}";
                }
            }
        });
        demo2.config({
            url:"{:url('mobile/user_port/register')}",
            ajaxpost:{
                error: function () {
                    layer.open({content:'网络繁忙,请重试',skin:'msg',time:2});
                }
            }
        });
    });
    //隐藏虚拟键盘

    //切换密码的可视类型
    function toggle(id){
        var type = $('#pwd'+id);
        if (type.prop('type') == 'text'){
            type.prop('type','password');
            $('#p_'+id).prop('src','__STATIC__/img_user/dl-mimab.png');
        }else {
            type.prop('type','text');
            $('#p_'+id).prop('src','__STATIC__/img_user/dl-mima.png');
        }
    }
    //发送验证码
    function check_num(){
        var tel = $("#un2").val();
        if (tel == ''){
            layer.open({content: '请输入注册账号', skin: 'msg', time:2});
            return false;
        }
        //if (!(/^1(3|4|5|7|8)\d{9}$/.test(tel))){
        if (!(/^1(1|2|3|4|5|6|7|8|9)\d{9}$/.test(tel))){
            layer.open({content: '账号格式不正确', skin: 'msg', time:2});
            return false;
        }
        if (!check_unique(tel)){
            return false;
        }

        count_down();
        $.ajax({
            url:"{:url('mobile/shop_set/get_code')}",
            dataType:'json',
            type:'post',
            data:{'tel':tel,'act':'reg'},
            success:function(t){
                layer.open({content:'发送成功',skin:'msg',time:2});
            }
        })
    }
    //验证码倒计时
    function count_down(){
        var num = 60;
        var verif = $('#yzm_2');
        var timer = setInterval(function(){
            verif.text(num+'秒');
            if (num <=60 && num >= 1){
                verif.removeAttr('href');
            }else{
                verif.text('重新获取验证码');
                window.clearInterval(timer);
                verif.attr("href",'javascript:check_num(this.id);');
            }
            num--;
        },1000);
    }
    //检测注册手机号码的唯一性
    function check_unique(tel){
        var flag = true;
        $.ajax({
            url:"{:url('mobile/shop_set/check_bind_tel')}",
            type:'post',
            async:false,
            dateType:'json',
            data:{'tel':tel},
            success:function(t){
                if (t.code != 200){
                    layer.open({content: t.message,skin: 'msg',time:2});
                    flag = false;
                }
            }
        });
        return flag;
    }

    function jump_about_us() {
        sessionStorage.setItem('about_us_url',window.location.href);
        window.location.href="{:url('mobile/user_info/user_about_us')}";
    }
</script>
</body>
</html>